<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../css/mui.min.css">
		<link rel="stylesheet" type="text/css" href="../css/goods/goods_list2.css" />
		<script type="text/javascript">
			(function() {
				var clientWidth = document.documentElement ? document.documentElement.clientWidth : document.body.clientWidth;
				clientWidth = clientWidth || localStorage.getItem("clientWidth")
				if(clientWidth > 750)
					clientWidth = 750;
				document.documentElement.style.fontSize = clientWidth * 1 / 16 + "px";
			})();
		</script>
		<style type="text/css">
			html,body{
				padding: 0;
				margin: 0;
			}
		</style>
	</head>

	<body>
	 

		<div id="pullrefresh" class=" mui-scroll-wrapper" style=" ">
			<div class="mui-scroll">
				<!--数据列表-->
				<div class="mui-content" style="padding-top: 0;">

					<div class="goods_list">

						<div class="item" v-for="i in goods_list" @click="to_detail(i.goodsid)">
							<img :src="i.pic" >
							<div class="title"><span class="spcile_price">
								<!-- <span>今日特价</span> -->
							 </span> {{i.name}}</div>
							<div class="price">
								<span>￥{{i.min_price}}元</span>
								<i><img src="../images/ptsp/car_03.png" alt=""></i>
							</div>
						</div>

					</div>

				</div>
			</div>
		</div>

		<script src="../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/vue.min.js"></script>
		<script src="../js/host.config.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/jquery.min.js"></script>
		<script type="text/javascript">
			var tab = new Vue({
				el: 'header',
				data: {

				},
				methods: {

				}
			});
			var app = new Vue({
				el: '.mui-content',
				data: {
					goods_list:'',
					has_more_data: true,
				},
				methods: {
					get_data: function(url, cb) {


						$.ajax({
							type:'get',
							url:url,
							data:{
								
							},
							success:function(res){

								if(typeof res == 'string'){
									res = JSON.parse(res)
								}
								console.log(res);
								if(res.code==1) {
									cb(res)
								}
							},error:function(){

							}
						})
						// mui.ajax(host_config.host + url, {

						// 	dataType: 'json', //服务器返回json格式数据
						// 	type: 'get', //HTTP请求类型
						// 	timeout: 10000, //超时时间设置为10秒；

						// 	success: function(res) {
						// 		//服务器返回响应，根据响应结果，分析是否登录成功；
						// 		console.log(res);
						// 		if(res.code == 200) {
						// 			cb(res)
						// 		}
						// 	},
						// 	error: function(xhr, type, errorThrown) {
						// 		//异常处理；
						// 		console.log(type);
						// 	}
						// });
					},
					get_more_data: function() {
						// var that = this;
						// if(this.has_more_data) {
						// 	this.get_data("/sim_data.search-group-list.json", function(res) {

						// 		var new_data = that.search-group-list.concat(res.data);
						// 		that.search-group-list = new_data;
						// 		//如果是最后一页数据,则将 has_more_data 改为false
						// 		that.has_more_data = false;
						// 	})
						// }
					},
					to_detail: function(goods_id) {
						mui.toast("goods_detail.html")
						mui.openWindow('goods_detail.html?goodsid='+goods_id, 'goods_detail.html')
					}
				},
				mounted: function() {
					var that = this;
					this.get_data("https://zhapp.4hl.cn/api/seller/get_goods", function(res) {
						that.goods_list = res.data;
						tap_init();
					})

					// 初始化页面
					mui.init({
						pullRefresh: {
							container: '#pullrefresh',
							down: {
								callback: pulldownRefresh
							},
							up: {
								contentrefresh: '正在加载...',
								callback: pullupRefresh
							}
						}
					});
				}
			})

			function tap_init() {
				function click() {
					this.click();
				}

				mui(".goods_list").on('tap', '.item', click)

			}

			function pulldownRefresh() {
				 setTimeout(function() {

				// 	app.get_data("/sim_data.search-group-list.json", function(res) {

				// 		app.search-group-list = res.data;
				// 	})
				// 	app.has_more_data = true;
				// 	//获取数据成功过后将 列表重新渲染，完成后执行
				 	mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //刷新完成
				 }, 1000);
			}

			function pullupRefresh() {
				// setTimeout(function() {
				// 	// 调用vue实例中的获取更多数据
				// 	app.get_more_data();
				// 	//如果 has_more_data 为false 则表示没有数据了 则调用endPullupToRefresh
					mui('#pullrefresh').pullRefresh().endPullupToRefresh(true); //参数为true代表没有更多数据了。

				// }, 1000);
			}
		</script>
	</body>

</html>